﻿<phone:PhoneApplicationPage 
    x:Class="MyMeetup.PanoramaGroupPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit" 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WP71"
    xmlns:MyMeetup="clr-namespace:MyMeetup.Helpers"
    xmlns:ig="clr-namespace:Infragistics.Controls.Interactions;assembly=InfragisticsWP7.Controls.Interactions.XamRating.v11.2"
    xmlns:telerikPrimitives="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Primitives"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="True" shell:SystemTray.Opacity="0"
    DataContext="{Binding GroupPageViewModel, Source={StaticResource Locator}}">

    <UserControl.Resources>
        <MyMeetup:GroupDescriptionFormatter x:Key="GroupDescriptionFormatter" />
    </UserControl.Resources>

    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <cmd:EventToCommand Command="{Binding LoadedCommand}" />
        </i:EventTrigger>
    </i:Interaction.Triggers>

    <!--LayoutRoot contains the root grid where all other page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.Resources>
            <Style x:Key="DataBoundListBoxCheckBoxStyle" TargetType="telerikPrimitives:ItemCheckBox">
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}" />
                <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}" />
            </Style>

            <DataTemplate x:Key="DataBoundListBoxItemTemplate">
                <Grid Margin="0,0,0,12">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>
                    <Image Width="99" Height="99" Source="{Binding album_photo.thumb_link}" Stretch="UniformToFill"/>
                    <StackPanel Margin="12,0,0,0" Grid.Column="1">
                        <TextBlock Text="{Binding title}" FontSize="{StaticResource PhoneFontSizeMedium}" FontFamily="{StaticResource PhoneFontFamilySemiBold}" />
                        <TextBlock Text="{Binding DateTime}" FontSize="{StaticResource PhoneFontSizeSmall}" Foreground="Gray" />
                    </StackPanel>
                </Grid>
            </DataTemplate>
        </Grid.Resources>

        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--"{StaticResource PhoneBackgroundBrush}"-->
        <Grid Grid.Row="1" Margin="0,0,0,0">
            

            <StackPanel VerticalAlignment="Top" Height="200" Background="{Binding BackgroundImage}"></StackPanel>
            <!--<Image Width="480" Height="200" Stretch="UniformToFill" VerticalAlignment="Top" Source="{Binding BackgroundImageUrl}" Opacity=".7" />-->
            <!-- this puts a slight overlay over the image to lighten/darken it per the current theme -->
            <Rectangle Fill="{StaticResource PhoneBackgroundBrush}" 
                       Opacity="0.4"
                       Height="200"
                       VerticalAlignment="Top"/>
            
            <controls:Panorama Name="groupPanorama"> <!--Background="{Binding BackgroundImage}" >-->
            <controls:Panorama.Title>
                
                <StackPanel Orientation="Horizontal" Margin="0,60,0,0">
                        <TextBlock x:Name="PageTitle" Text="{Binding Model.name}" Margin="12,12,0,50" FontFamily="{StaticResource PhoneFontFamilySemiBold}"  Style="{StaticResource PhoneTextTitle2Style}"/>
                        <!--<TextBlock Text="{Binding Model.name}" FontSize="100"  VerticalAlignment="Center"/>-->
                    </StackPanel>
            </controls:Panorama.Title>


            <!--Panorama item two-->
            <controls:PanoramaItem Header="events" HeaderTemplate="{StaticResource OpaqueHeader}">
                <ScrollViewer>
                    <StackPanel>
                        <ListBox Name="eventList" ItemsSource="{Binding GroupEvents}" SelectedItem="{Binding SelectedEvent, Mode=TwoWay}" ItemContainerStyle="{StaticResource SingleItemList}" ScrollViewer.VerticalScrollBarVisibility="Disabled">
                            <i:Interaction.Triggers>
                                <i:EventTrigger EventName="Tap">
                                    <cmd:EventToCommand Command="{Binding EventPageCommand, Mode=OneWay}"/>
                                </i:EventTrigger>
                            </i:Interaction.Triggers>
                    
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel>
                                        <toolkit:ContextMenuService.ContextMenu>
                                            <toolkit:ContextMenu>
                                                <toolkit:MenuItem Header="checkin" Command="{Binding GroupPageViewModel.CheckinCommand, Source={StaticResource Locator}}" CommandParameter="{Binding}" />
                                                <toolkit:MenuItem Header="rsvp yes" Command="{Binding GroupPageViewModel.RsvpYesCommand, Source={StaticResource Locator}}" CommandParameter="{Binding}" />
                                                <toolkit:MenuItem Header="rsvp no" Command="{Binding GroupPageViewModel.RsvpNoCommand, Source={StaticResource Locator}}" CommandParameter="{Binding}" />
                                            </toolkit:ContextMenu>
                                        </toolkit:ContextMenuService.ContextMenu>
                                        <StackPanel Orientation="Horizontal" Width="Auto">
                                            <StackPanel Orientation="Vertical">
                                                <TextBlock Width="400" Text="{Binding name}" FontSize="{StaticResource PhoneFontSizeMediumLarge}" />
                                                <TextBlock Width="400" Text="{Binding DateTime}" FontSize="{StaticResource PhoneFontSizeSmall}" Foreground="Gray" />
                                                <StackPanel Orientation="Horizontal" Height="30" >
                                                    <ig:XamRating Rating="{Binding rating.Average}" IsEnabled="False"  Style="{StaticResource xamRatingStyleSmall}" />
                                                    <TextBlock Text="{Binding ReviewCountSummary}" Padding="10,0,0,0" VerticalAlignment="Center" FontSize="{StaticResource PhoneFontSizeSmall}" Foreground="Gray"/>
                                                </StackPanel>
                                            </StackPanel>
                                        </StackPanel>
                                    </StackPanel>
                                </DataTemplate>
                            </ListBox.ItemTemplate>

                        </ListBox>
                        
                        <TextBlock Text="show more events . . ." FontSize="32" Padding="25" Visibility="{Binding ShowPastEventsVisibility}">
                            <i:Interaction.Triggers>
                                <i:EventTrigger EventName="Tap">
                                    <cmd:EventToCommand Command="{Binding ShowPastEventsCommand, Mode=OneWay}"/>
                                </i:EventTrigger>
                            </i:Interaction.Triggers>
                        </TextBlock>
                        
                    </StackPanel>
                </ScrollViewer>
            </controls:PanoramaItem>

            <!--Panorama item three-->
            <controls:PanoramaItem Header="photos" HeaderTemplate="{StaticResource OpaqueHeader}">

                    <telerikPrimitives:RadDataBoundListBox Margin="12,6,12,0"
                                                        x:Name="DataBoundListBox1"
                                                        ItemsSource="{Binding PhotoAlbums}"
                                                        IsCheckModeEnabled="False"
                                                        ItemTemplate="{StaticResource DataBoundListBoxItemTemplate}"
                                                        SelectedItem="{Binding SelectedAlbum, Mode=TwoWay}">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="Tap">
                                <cmd:EventToCommand Command="{Binding AlbumPageCommand, Mode=OneWay}"/>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </telerikPrimitives:RadDataBoundListBox>
                
            </controls:PanoramaItem>

                <controls:PanoramaItem Header="about" HeaderTemplate="{StaticResource OpaqueHeader}">
                    <ScrollViewer Height="auto">
                        <StackPanel>
                            <TextBlock Name="about" Text="{Binding Model.description,  Converter={StaticResource GroupDescriptionFormatter}}" TextWrapping="Wrap" Padding="10,0,0,20"/>
                        </StackPanel>
                    </ScrollViewer>
                </controls:PanoramaItem>

                <!-- Panorama item four-->
            <controls:PanoramaItem Header="organizer" HeaderTemplate="{StaticResource OpaqueHeader}">
                <ScrollViewer>
                    <StackPanel Margin="10,0,0,0">
                        <Image Source="{Binding Organizer.photo_url}" MaxHeight="400" HorizontalAlignment="Left" />
                        <TextBlock Text="{Binding Model.organizer.name}" FontSize="{StaticResource PhoneFontSizeLarge}" />
                        <TextBlock Text="{Binding Organizer.bio}" TextWrapping="Wrap"/>
                    </StackPanel>
                </ScrollViewer>
            </controls:PanoramaItem>
        </controls:Panorama>
</Grid>
    </Grid>

    <!--Panorama-based applications should not show an ApplicationBar-->

</phone:PhoneApplicationPage>